import { Component, Prop } from 'vue-facing-decorator'
import Render from '@/render/Render'
import toNative from '@/utils/toNative'
import type { InsureEnsurePlanListDto } from '@/api/insureEnsurePlan/types'
import { getInsureCompanyRuleDetail } from '@/api/insureCompanyRule'
import type { InsureCompanyRuleDetailDto } from '@/api/insureCompanyRule/types'
import PreviewRuleDetail from '@/views/insurance-manage/rule-center/insurance-company/components/PreviewRuleDetail'

@Component
export class RuleInfo extends Render {
    @Prop() detailData!: InsureEnsurePlanListDto

    ruleDetailData = {} as InsureCompanyRuleDetailDto

    async initData() {
        const res = await getInsureCompanyRuleDetail({
            id: this.detailData.ruleId
        })
        this.ruleDetailData = res
    }

    mounted() {
        this.initData()
    }

    render() {
        return <>
            <PreviewRuleDetail detailData={this.ruleDetailData} />
        </>
    }
}

export default toNative<{detailData: InsureEnsurePlanListDto}, {}>(RuleInfo)